import React from 'react'
import './index.less'
import menuConfig from '../../resource/menuConfig.js'
// import { SubMenu } from 'rc-menu'
import {Menu} from 'antd'
const { SubMenu } = Menu;

export default class NavLeft extends React.Component{
    // 所有需要更新的数据，一律放在这里，同时，需要用setState修改状态
    componentWillMount(){
        const menuTreeNode = this.renderMenu(menuConfig);
        this.setState({
            menuTreeNode
        })
    }

    renderMenu=(data)=>{
        return data.map((item)=>{
            if(item.children){
                return(
                    <SubMenu title={item.title} key={item.key}>  
                        {this.renderMenu(item.children)}
                    </SubMenu>
                )
            }
        return <Menu.Item title={item.title} key={item.key}>{item.title}</Menu.Item>
        })
    }

  


    render(){
        return(
            <div>
                <div className='logo'>
                    <img src="/assets/logo.svg" alt=""></img>
                    <h1>航测遥感局</h1>
                </div>
                <Menu theme='dark'>
                    {this.state.menuTreeNode}
                </Menu>
                
            </div>

        )

    }

}